<input class="input" name="text" type="text" placeholder="Full Name">
<style>
/* From Uiverse.io by saidbl1 - Tags: input, modern, animated, clean */
.input {
  height: 40px;
  border-radius: 8px;
  border: 2px solid hsl(236, 92%, 66%);
  outline: none;
  transition: 200ms ease-in;
  padding-left: 1rem;
}

.input:focus {
  border-bottom: 4px solid hsl(236, 92%, 66%);
  padding-top: 2px;
}

.input::placeholder {
  color: hsl(236, 92%, 66%);
  opacity: 0.5;
}
</style>
